<template>
	<!--preview相同为同一组，preview数值得不同-->
	  <view class="flex-comment-image clearfix">
		  <!-- #ifdef H5 -->
			<view class="flex-item flex-item-h5" v-for="(img,i) in myImgList" :key="i">
				<view class="imageH5bg" :style="{ backgroundImage: 'url('+ img +')'}"></view>
				<img class="imageUrl imageH5" :mode="mode?mode:'widthFix'"
					:preview="index"
					:src="img">
			</view>
		  <!-- #endif -->
		  <!-- #ifdef MP || APP-PLUS -->
		  <view class="flex-item" v-for="(img,i) in myImgList" :key="i">
				<image class="imageUrl" :mode="mode?mode:'widthFix'"
					@click="showPreviewImage"
					:src="img"></image>
			</view>
		  <!-- #endif -->
	  </view>
</template>

<script>
var photoShow = true;
var starTimes = 1
export default {
  name: 'app',
  data() {
    return {
			slidesList:"",
			myImgList: []
    }
  },
  props:["imgList","index","mode","otherImgList", "imgIndex"],
	watch: {
		imgList: {
			handler(list) {
				if (Array.isArray(list)) {
					this.myImgList = list
				} else {
					this.myImgList = [list]
				}
			},
			immediate: true
		}
	},
  mounted() {
	// #ifdef  H5
		let oBtn = document.querySelectorAll('.pswp')[0];
		var lastClickTime =0;
		let moveX = 0;
        let clickTimer,nowTime;
        oBtn.addEventListener('touchstart', (event) => {
			moveX = 0;
            nowTime = new Date().getTime();
        });
        oBtn.addEventListener('touchmove', (event) => {
			moveX = event.touches[0].pageX;
			console.log('touchmove',moveX)
        });
        oBtn.addEventListener('touchend', (event) => {
			// let lastX = moveX - startX;
			console.log(moveX);
			if(moveX>=30){
				return
			}
            if (nowTime - lastClickTime < 450) {
                /*双击*/
                lastClickTime = 0;
                clickTimer && clearTimeout(clickTimer);
                console.log('双击');
            } else {
                /*单击*/
                lastClickTime = nowTime;
                clickTimer = setTimeout(() => {
                    // console.log('单击');
					this.$preview.self.close();
                }, 400);
            }
        });
	// #endif
  },
  beforeDestroy() {
	// #ifdef  H5
		let pswpOpacity = document.getElementsByClassName('pswp')[0].style.opacity;
		if(pswpOpacity ==1){
			this.$preview.self.close();
		}
	// #endif

  },
  methods: {
	 //点击预览图片
	 showPreviewImage(){ //触发图片预览
// 		let obj = {
// 			indicator:'default',
// 		}//图片配置
		if(this.index=="banner"){ // || this.index =="skuImage"
			uni.previewImage({
				urls: this.otherImgList,
				current: this.imgIndex
			});
		}else{
			uni.previewImage({
				urls: this.myImgList,
				current: this.imgIndex
			});
		}
	 },
	 // closeImgPreview(){
		// if(photoShow){
		// 	console.log('正常回退');
		// 	alert("正常回退")
		// 	uni.navigateBack();
		// }else{
		// 	alert("关闭")
		// 	this.$preview.self.close();
		// 	// photoShow = true;
		// }
	 // },
  },


}
</script>

<style>


</style>
